import React from "react";
import PropTypes from "prop-types";

import Icon from "../../components/Icon/index";

// utils
import { alert } from "../../utils/dingtalk.js";

function formatDate(date) {
  if (!date) return;

  const ymd = date.split("-");
  const year = ymd[0];
  const month = ymd[1];

  return `${year}年${month}月`;
}
function isCurrentMonth() {
  return false;
}
function getText(date = new Date()) {
  if (isCurrentMonth()) {
    return `本月（${formatDate(date.format("yyyy-MM-dd"))}）`;
  }
  return formatDate(date.format("yyyy-MM-dd"));
}

function isLastMonth(date) {
  if (!date) return true;
  if (
    formatDate(date.format("yyyy-MM-dd")) ===
    formatDate(new Date().format("yyyy-MM-dd"))
  ) {
    return true;
  }
  return false;
}

const RangePicker = ({ onPick, date }) => (
  <div className="todo-range-picker">
    <span
      onClick={onPick.bind(null, "left")}
      className="todo-range-picker-left"
    >
      <Icon type="left" />
    </span>
    {getText(date)}
    <span
      onClick={() => {
        window._rlog(`_todoList_picker`)
        onPick("right");
        // }
      }}
      className={`todo-range-picker-right`}
      /* className={`todo-range-picker-right ${isLastMonth(date)
        ? "todo-range-last"
        : ""}`} */
    >
      <Icon type="right" />
    </span>
  </div>
);

RangePicker.propTypes = {
  onPick: PropTypes.func,
  date: PropTypes.string
};
export default RangePicker;
